import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:pornhub_app/components/image_view.dart';
import 'package:pornhub_app/components/text_view.dart';
import 'package:pornhub_app/model/engagement/engagement_detail_model.dart';
import 'package:pornhub_app/utils/color.dart';
import '../../../assets/styles.dart';
import '../controllers/engagement_detail_page_controller.dart';

class EngagementDetailPage extends StatefulWidget {
  const EngagementDetailPage({super.key});

  @override
  State createState() => _EngagementDetailPageState();
}

class _EngagementDetailPageState extends State<EngagementDetailPage> {
  final controller = Get.find<EngagementDetailPageController>();
  final PageController _pageController = PageController();
  int _currentIndex = 0;

  @override
  void initState() {
    super.initState();
    _pageController.addListener(() {
      setState(() {
        _currentIndex = _pageController.page?.round() ?? 0;
      });
    });
    controller.initDatas();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        slivers: [
          SliverAppBar(
            expandedHeight: 450.h,
            flexibleSpace: FlexibleSpaceBar(
              background: Obx(
                () => PageView.builder(
                  controller: _pageController,
                  itemCount: controller.bgImages.value.length,
                  itemBuilder: (context, index) {
                    return Stack(
                      children: [
                        ImageView(
                          src: controller.bgImages.value[index].url ?? "",
                          width: double.infinity,
                          height: double.infinity,
                          fit: BoxFit.cover,
                        ),
                        Positioned(
                          right: 12.w,
                          bottom: 12.h,
                          child: Container(
                            alignment: Alignment.center,
                            padding: EdgeInsets.symmetric(
                                horizontal: 15.w, vertical: 5.h),
                            decoration: BoxDecoration(
                              color: COLOR.black.withOpacity(0.5),
                              borderRadius: BorderRadius.all(
                                Radius.circular(15.w),
                              ),
                            ),
                            child: TextView(
                              text:
                                  '${_currentIndex + 1}/${controller.bgImages.value.length}',
                              fontSize: 12.sp,
                              color: COLOR.white,
                            ),
                          ),
                        ),
                      ],
                    );
                  },
                ),
              ),
            ),
            pinned: true,
            centerTitle: true,
          ),
          SliverToBoxAdapter(
            child: Obx(
              () => Container(
                margin: EdgeInsets.only(top: 20.h, left: 14.w, right: 14.w),
                child: Row(
                  children: [
                    Expanded(
                      child: TextView(
                        text: controller.engagementModel.value.nickName ?? "",
                        fontSize: 18.sp,
                        color: COLOR.color_333333,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                    GestureDetector(
                      onTap: () {
                        controller.likeOrCancel();
                      },
                      child: Container(
                        padding: EdgeInsets.symmetric(
                            horizontal: 14.w, vertical: 5.h),
                        decoration: BoxDecoration(
                          color: controller.isLike.value == true
                              ? COLOR.white
                              : COLOR.color_F52443,
                          borderRadius: BorderRadius.all(Radius.circular(20.w)),
                          border: controller.isLike.value == true
                              ? Border.all(
                                  color: COLOR.color_F52443) // 这里替换为实际的边框颜色
                              : null,
                        ),
                        child: TextView(
                          text:
                              controller.isLike.value == true ? '已关注' : '+ 关注',
                          fontSize: 12.sp,
                          color: controller.isLike.value == true
                              ? COLOR.color_FF4340
                              : COLOR.white,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
          SliverToBoxAdapter(
            child: Container(
              margin: EdgeInsets.only(top: 15.h, left: 14.w),
              height: 23.h,
              child: Obx(
                () => ListView.builder(
                  scrollDirection: Axis.horizontal,
                  shrinkWrap: true,
                  itemCount: controller.serviceTags.value.length,
                  itemBuilder: (BuildContext context, int index) {
                    return Container(
                      margin: EdgeInsets.only(right: 14.w),
                      padding:
                          EdgeInsets.symmetric(horizontal: 7.w, vertical: 3.h),
                      height: 23.h,
                      decoration: BoxDecoration(
                        color: COLOR.color_FFDAD9,
                        borderRadius: BorderRadius.all(
                          Radius.circular(4.w),
                        ),
                      ),
                      alignment: Alignment.center,
                      child: TextView(
                        text: controller.serviceTags.value[index],
                        fontSize: 12.sp,
                        color: COLOR.color_FF4340,
                      ),
                    );
                  },
                ),
              ),
            ),
          ),
          SliverToBoxAdapter(
            child: Obx(
              () => bodyViews(controller.engagementModel.value),
            ),
          ),
        ],
      ),
    );
  }

  Widget bodyViews(EngagementDetailModel model) {
    var serviceTags = '';
    model.serviceTags?.forEach((fruit) {
      serviceTags = serviceTags + fruit.toString();
    });
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 14.w),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(height: 20.w),
          Container(
            padding: EdgeInsets.only(left: 15.w, right: 10.w),
            height: 60.h,
            width: double.infinity,
            decoration: BoxDecoration(
              color: COLOR.color_EFEFEF,
              borderRadius: Styles.borderRadius.m,
            ),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Image.asset(
                  'assets/engagement/icon_hint.png',
                  width: 40.w,
                  height: 40.w,
                ),
                SizedBox(width: 10.w),
                Expanded(
                  child: TextView(
                    text: "约炮消费，谨记“先服务后给钱”的原则，先给钱被骗，平台概不负责！",
                    fontSize: 12.sp,
                    color: COLOR.color_999999,
                  ),
                ),
              ],
            ),
          ),
          Container(
            width: double.infinity,
            height: 46.h,
            margin: EdgeInsets.only(top: 14.h),
            decoration: BoxDecoration(
              color: COLOR.color_EFEFEF,
              borderRadius: Styles.borderRadius.m,
            ),
            alignment: Alignment.center,
            child: TextView(
              text:
                  model.isUnlock == true ? "${model.contactDtl}" : '联系方式：立即解锁',
              fontSize: 14.sp,
              color: COLOR.color_FF4340,
              textAlign: TextAlign.center,
              fontWeight: FontWeight.w700,
            ),
          ),
          Container(
            margin: EdgeInsets.only(top: 20.h),
            child: TextView(
              text: 'TA的资料',
              fontSize: 14.sp,
              color: COLOR.color_666666,
              fontWeight: FontWeight.w500,
            ),
          ),
          Container(
            width: double.infinity,
            margin: EdgeInsets.only(top: 10.h, bottom: 10.h),
            padding: EdgeInsets.symmetric(vertical: 14.h, horizontal: 14.w),
            decoration: BoxDecoration(
              color: COLOR.color_EFEFEF,
              borderRadius: Styles.borderRadius.m,
            ),
            child: Column(
              children: [
                itemInfoView("所在地区：${model.cityName}"),
                itemInfoView("消费情况：${model.price}/p${model.nightPrice}/包夜"),
                itemInfoView("消费形式：${model.consumeForm}"),
                itemInfoView("服务项目：${serviceTags}"),
                itemInfoView("服务详情：${model.info}"),
              ],
            ),
          ),
          Visibility(
            visible: model.isUnlock != true,
            child: GestureDetector(
              onTap: () {
                controller.unlock();
              },
              child: Container(
                height: 40.h,
                width: double.infinity,
                margin: EdgeInsets.symmetric(vertical: 10.h, horizontal: 6.w),
                decoration: BoxDecoration(
                  color: COLOR.color_F52443,
                  borderRadius: BorderRadius.all(
                    Radius.circular(20.w),
                  ),
                ),
                alignment: Alignment.center,
                child: TextView(
                  text: '${model.unlockGold}金币解锁联系方式',
                  fontSize: 16.sp,
                  color: COLOR.white,
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  itemInfoView(String text) {
    return Container(
      margin: EdgeInsets.only(top: 10.h),
      alignment: Alignment.centerLeft,
      child: TextView(
        text: '${text}',
        fontSize: 13.sp,
        color: COLOR.color_999999,
        textAlign: TextAlign.start,
        fontWeight: FontWeight.w500,
      ),
    );
  }
}
